<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<link rel="stylesheet" type="text/css"
		href="${facesContext.externalContext.requestContextPath}/css/style.css" />
	<title><ui:insert name="title">ROR Test Task</ui:insert></title>
</h:head>
<h:body>

	<p:commandButton id="newProject" value="Add project"
		onclick="newProject.show();" type="button" />
	<br />
	<p:dialog id="newProjectDialog" header="Create new project"
		widgetVar="newProject" modal="true" height="100">
		<h:form>
			<h:panelGrid columns="2">
				<h:outputText value="Project name:" />
				<h:inputText value="#{userMain.newProject.projectName}"
					required="true" />
				<h:outputText value="Project description:" />
				<h:inputText value="#{userMain.newProject.projectDescription}"
					required="true" />
			</h:panelGrid>
			<p:commandButton id="submitButton" value="Submit"
				update=":form:projects" oncomplete="newProject.hide();"
				action="#{userMain.addNewProject}" />
		</h:form>
	</p:dialog>
	<h:form id="form">
		<p:dataTable id="projects" var="project" value="#{userMain.projects}"
			rowKey="#{project.projectName}"
			selection="#{userMain.selectedProject}" selectionMode="single">
			<p:column headerText="Name">
				<h:outputText value="#{project.projectName}" />
			</p:column>
			<p:column headerText="Description">
				<h:outputText value="#{project.projectDescription}" />
			</p:column>
			<p:column headerText="Options">
				<p:commandButton value="edit" oncomplete="editProject.show()">
					<f:setPropertyActionListener value="#{project}"
						target="#{userMain.tempProject}" />
				</p:commandButton>
			</p:column>
			<p:ajax event="rowSelect" listener="#{userMain.onRowSelect}"
				update=":form:tasks" />
		</p:dataTable>
		<p:dialog id="editProjectDialog" header="Edit Project Dialog"
			widgetVar="editProject" modal="true" height="100">
			<h:panelGrid columns="2">
				<h:outputText value="Project name:" />
				<h:outputText value="#{userMain.tempProject.projectName}" />
				<h:outputText value="Project description:" />
				<!-- <h:inputText value="#{userMain.tempProject.projectDescription}"
					required="true" /> -->
			</h:panelGrid>
		</p:dialog>
		<br />
		<p:dataTable id="tasks" var="task" value="#{userMain.tasks}"
			editable="true">
			<p:column headerText="Name">
		#{task.taskName}
		</p:column>
			<p:column headerText="Deadline">
		#{task.taskDeadline}
		</p:column>
			<p:column headerText="Priority">
		#{task.taskPriority}
		</p:column>
			<p:column headerText="Status">
		#{task.status}
		</p:column>
			<p:column headerText="Description">
		#{task.taskDescription}
		</p:column>
		</p:dataTable>
	</h:form>
</h:body>
</html>
